<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        /*解决闪烁问题*/
        [v-clock] {
            display: none;
        }

    </style>
</head>
<body>

<div id="app">

    {{info.name}}
</div>


<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
<script>

    var app = new Vue({
        el: "#app",
        mounted() {//钩子函数
            axios.get('data.json').then
            ((response) => {
                    // console.log(response.data);
                    this.info = response.data
                },
                (err) => {
                    console.log(err)
                }
            )

        },
        data() {
            return {
                info: {
                    name: null,
                    url: null
                }
            }
        },

        // data: {
        //     message: "213123123123",
        //
        // }

    })


</script>
</body>
</html>